/**
 * 游戏背景类
 * 提供 update 和 render 函数实现无限滚动的背景功能
 */
export default class Home {
	constructor(canvas, ctx,mainRender) {
		this.canvas = canvas
		this.ctx = ctx
		this.mainRender=mainRender
		this.homebg = { x: 0, y: 0, w: canvas.width, h: canvas.height - 50 } //首页元素
		this.startBtn = { x: canvas.width * 0.5 - 100, y: canvas.height * 0.7, w: 200, h: 80 } //开始按钮
		this.musicBtn = { x: canvas.width - 120, y: 80, r: 20 } //音乐按钮
		this.rukouBtn = { x: 20, y: 280, w: 50, h: 50 } //入口按钮
		tt.onTouchStart(res => this.handleTouch(res));
		// super(BACKGROUND_IMAGE_SRC, BACKGROUND_WIDTH, BACKGROUND_HEIGHT);
		// this.top = 0;
	}
	update() {}
	// 绘制首页背景
	render(ctx) {
		ctx.clearRect(0, 0, this.canvas.width, this.canvas.height); // 先清空清空画布
		// 绘制背景
		ctx.drawImage(GameGlobal.databus.resources.homeBg,
			this.homebg.x, this.homebg.y,
			this.homebg.w, this.homebg.h);
		// 绘制开始按钮
		ctx.fillStyle = '#4CAF50'; // ✨ 直接使用属性赋值
		ctx.fillRect(this.startBtn.x, this.startBtn.y, this.startBtn.w, this.startBtn.h);
		ctx.fillStyle = '#FFFFFF'; // ✨ 直接使用属性赋值
		ctx.font = '24px Arial';
		ctx.fillText('开始找茬', this.startBtn.x + 50, this.startBtn.y + 50);

		// 绘制入口
		ctx.fillStyle = '#4CAF50'; // ✨ 直接使用属性赋值
		ctx.fillRect(this.rukouBtn.x, this.rukouBtn.y, this.rukouBtn.w, this.rukouBtn.h);
		ctx.fillStyle = '#FFFFFF'; // ✨ 直接使用属性赋值
		ctx.font = '16px Arial';
		ctx.fillText('入口有奖', this.rukouBtn.x + 50, this.rukouBtn.y + 50);

		// 绘制音乐按钮
		ctx.beginPath();
		ctx.arc(this.musicBtn.x, this.musicBtn.y, this.musicBtn.r, 0, 2 * Math.PI);
		ctx.fillStyle = GameGlobal.databus.isMusicOn ? '#00FF00' : '#FF0000'; // ✨ 直接使用属性赋值
		ctx.fill();
	}

	// 触摸事件处理
	handleTouch(e) {
		const touch = e.touches[0];
		const x = touch.clientX;
		const y = touch.clientY;
		if (GameGlobal.databus.gameState === 'home') {
			if (this.isInRect(x, y, this.startBtn)) {
				// 是否触摸开始按钮
				GameGlobal.databus.gameState="game"
				this.mainRender()
			} else
			if ( this.isInRect(x, y, this.rukouBtn)) {
				// 是否触摸入口按钮
				tt.checkScene({
					scene: "sidebar",
					success: (res) => {
						console.log("check scene success: ", res.isExist);
						if (res.isExist) {
							tt.navigateToScene({
								scene: 'sidebar',
								fail: console.log,
								success: console.log
							})
						}
						//成功回调逻辑
					},
					fail: (res) => {
						console.log("check scene fail:", res);
						//失败回调逻辑
					}
				});
			} else if (this.isInCircle(x, y, this.musicBtn)) {
				// 是否触摸音乐
				this.toggleMusic();
			}
		}
	}
	
	// 辅助函数
	isInRect(x, y, rect) {
		return x >= rect.x && x <= rect.x + rect.w &&
			y >= rect.y && y <= rect.y + rect.h;
	}
	
	isInCircle(x, y, circle) {
		const dx = x - circle.x;
		const dy = y - circle.y;
		return dx * dx + dy * dy <= circle.r * circle.r;
	}
	
	// 切换音乐
	toggleMusic() {
		GameGlobal.musicManager.toggleMusic()
		this.render();
	}
	//  // 绘制游戏背景
	// renderGame(ctx,gameScreen) {
	// 	// 绘制背景
	// 	ctx.drawImage(GameGlobal.databus.resources.gameBg,
	// 		this.gamebg.x, this.gamebg.y,
	// 		this.gamebg.w, this.gamebg.h);
	// }

}